<template>
  <div class="work">
      <div class="header">
        <el-form :model="queryParams" ref="queryForm"  v-show="showSearch" :inline="true"  label-width="68px">
            <el-form-item label="反馈时间" class="recordName">
                <el-date-picker v-model="dateRange" size="small" style="width: 240px" value-format="yyyy-MM" type="monthrange" 
                range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
            </el-form-item>
            <el-form-item label="发生阶段" class="problemStage">
                <el-select v-model="queryParams.problemStage" placeholder="请选择问题发生阶段" clearable size="small">
                <el-option
                    v-for="dict in problemStageOptions"
                    :key="dict.dictValue"
                    :label="dict.dictLabel"
                    :value="dict.dictValue"
                />
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
            </el-form-item>
            <el-form-item>
            <span style="color:#00FFE3">默认查询当前年的数据</span>
            </el-form-item>
        </el-form>
        
      </div>
      <div  class="bold">
            <div class="middle">
                <AnalyzeDoubleBarChartsSystem class="middleTwo" :chart-data="SystemZcRate"/>
                <AnalyzeDoubleBarChartsSystem class="middleTwo" :chart-data="SystemDcRate"/>
            </div>
            <div class="footer">
                <AnalyzeDoubleBarChartsSystem class="middleTwo" :chart-data="SystemDpRate"/>
                <AnalyzeDoubleBarChartsSystem class="middleTwo" :chart-data="SystemCsRate"/>
                <AnalyzeDoubleBarChartsSystem class="middleTwo" :chart-data="SystemCdRate"/>
            </div>
      </div>
</div>      
</template>

<script>
import { queryRateBySystemZc,queryRateBySystemDc,queryRateBySystemDp,queryRateBySystemCs,queryRateBySystemCd} from "@/api/statistics/errorrate/errorrateSystem.js";
import { getToken } from '@/utils/auth';
import echarts from 'echarts';
import AnalyzeDoubleBarChartsSystem from '../errorrate/barcharts/AnalyzeDoubleBarChartsSystem';

export default {
    name: "errorrate",
    components:{
        AnalyzeDoubleBarChartsSystem
    },
    data() {
        return {
            // 日期范围
            dateRange: [],
            // 显示搜索条件
            showSearch: true,
            SystemDpRate:{},
            SystemCdRate:{},
            SystemCsRate:{},
            SystemZcRate:{},
            SystemDcRate:{},
            allPieChartRateByGroups:{},
            problemStageOptions: [],
            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                problemStage: null,
                
            
            },
             //是否输出
            isSubmitFileOptions:[],
            //状态
            stateOptions: [],
            // 是否超时字典
            isTimeOutOptions: [],
            work: {
                title:"",
                open:false,
                
            },
            queryDetailParam:{}
        }
    },
    created() {
        this.getList();
        this.getDicts("qa_stage_type").then(response => {
        this.problemStageOptions = response.data;
    });
    },
    mounted () {
        let that = this
       
        this.queryRateBarChartsBySystemZc();
        this.queryRateBarChartsBySystemDc();
        this.queryRateBarChartsBySystemDp();
        this.queryRateBarChartsBySystemCs();
        this.queryRateBarChartsBySystemCd();
        
        
    },
    activated(){
    
    },
    methods: {
        // 是否超时字典翻译
        isTimeOutFormat(row, column) {
            return this.selectDictLabel(this.isTimeOutOptions, row.isTimeOut);
        },
        // 是否提交输出物字典翻译
        isSubmitFileFormat(row, column) {
            return this.selectDictLabel(this.isSubmitFileOptions, row.isSubmitFile);
        },
        // 任务状态翻译
        stateFormat(row, column) {
            return this.selectDictLabel(this.stateOptions, row.state);
        },
        getWorkList(){
             this.work.loading = true;
            listProcess(this.queryParams).then(response => {
                this.work.processList = response.rows;
                this.work.total = response.total;
                this.work.loading = false;
            });
        },
        /** 查询所有图表 */
        getList() {
            this.loading = true;
            this.queryParams.deptId = "";
            
            this.queryRateBarChartsBySystemZc(this.addDateRange(this.queryParams,this.dateRange));
            this.queryRateBarChartsBySystemDc(this.addDateRange(this.queryParams,this.dateRange));
            this.queryRateBarChartsBySystemDp(this.addDateRange(this.queryParams,this.dateRange));
            this.queryRateBarChartsBySystemCs(this.addDateRange(this.queryParams,this.dateRange));
            this.queryRateBarChartsBySystemCd(this.addDateRange(this.queryParams,this.dateRange));

        },
        /** 搜索按钮操作 */
        handleQuery() {
            this.getList();
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.dateRange = [];
            this.queryParams.recordName = "";
            this.queryParams.problemStage = "";
            this.handleQuery();
            
            this.queryRateBarChartsBySystemZc();
            this.queryRateBarChartsBySystemDc();
            this.queryRateBarChartsBySystemDp();
            this.queryRateBarChartsBySystemCs();
            this.queryRateBarChartsBySystemCd();
          
            
            
        },
        
        // 根据车型查询的差错率
        //整车
        queryRateBarChartsBySystemZc(params){
            queryRateBySystemZc(params).then(response => {
           
               let newObject = {
                    tdata:[],
                    xdata:[],
                    qydata:[],
                    zxdata:[],
                    zydata:[],
                    qyavgdata:[],
                    zxavgdata:[],
                    zyavgdata:[]
                                          
                }  
                if(response.data.xInfo.length>0){
                    response.data.xInfo.forEach((item,index)=>{
                        newObject.xdata.push(item.month)
                        newObject.qydata.push(item.qyRate)
                        newObject.zxdata.push(item.zxRate)
                        newObject.zydata.push(item.zyRate) 
                        
                    })

                    response.data.average.forEach((item1,index)=>{
                        if(item1.type == 0){
                            newObject.qyavgdata.push(item1.average)
                        }else if (item1.type == 1){
                            newObject.zxavgdata.push(item1.average)
                        }else if(item1.type == 2){
                            newObject.zyavgdata.push(item1.average)
                        }
                    })
                }
                
               
                newObject.tdata.push("整车差错率");
                this.SystemZcRate = newObject;  
            });
        },
        //动传
        queryRateBarChartsBySystemDc(params){
            queryRateBySystemDc(params).then(response => {
           
               let newObject = {
                    tdata:[],
                    xdata:[],
                    qydata:[],
                    zxdata:[],
                    zydata:[],
                    qyavgdata:[],
                    zxavgdata:[],
                    zyavgdata:[]
                                          
                }
               
                if(response.data.xInfo.length>0){
                   
                    response.data.xInfo.forEach((item,index)=>{
                   
                        newObject.xdata.push(item.month)
                        newObject.qydata.push(item.qyRate)
                        newObject.zxdata.push(item.zxRate)
                        newObject.zydata.push(item.zyRate) 
                        
                    })

                    response.data.average.forEach((item1,index)=>{
        
                        if(item1.type == 0){
                        newObject.qyavgdata.push(item1.average)
                        }else if (item1.type == 1){
                        newObject.zxavgdata.push(item1.average)
                        }else if(item1.type == 2){
                        newObject.zyavgdata.push(item1.average)
                        }
                        
                    })
                }
                
               
                newObject.tdata.push("动传差错率");
                this.SystemDcRate = newObject;  
            });
        },
        //底盘
        queryRateBarChartsBySystemDp(params){
            queryRateBySystemDp(params).then(response => {
       
               let newObject = {
                    tdata:[],
                    xdata:[],
                    qydata:[],
                    zxdata:[],
                    zydata:[],
                    qyavgdata:[],
                    zxavgdata:[],
                    zyavgdata:[]
                                          
                }  
                if(null!=response.data){
                response.data.xInfo.forEach((item,index)=>{
                   
                    newObject.xdata.push(item.month)
                    newObject.qydata.push(item.qyRate)
                    newObject.zxdata.push(item.zxRate)
                    newObject.zydata.push(item.zyRate) 
                     
                })

                 response.data.average.forEach((item1,index)=>{
    
                    if(item1.type == 0){
                    newObject.qyavgdata.push(item1.average)
                    }else if (item1.type == 1){
                    newObject.zxavgdata.push(item1.average)
                    }else if(item1.type == 2){
                    newObject.zyavgdata.push(item1.average)
                    }
                       
                })
                }
                newObject.tdata.push("底盘差错率");
                this.SystemDpRate = newObject;  
            });
        },
        //车身
        queryRateBarChartsBySystemCs(params){
            queryRateBySystemCs(params).then(response => {
           
               let newObject = {
                    tdata:[],
                    xdata:[],
                    qydata:[],
                    zxdata:[],
                    zydata:[],
                    qyavgdata:[],
                    zxavgdata:[],
                    zyavgdata:[]
                                          
                }  
                if(response.data.xInfo.length>0){
                response.data.xInfo.forEach((item,index)=>{
                   
                    newObject.xdata.push(item.month)
                    newObject.qydata.push(item.qyRate)
                    newObject.zxdata.push(item.zxRate)
                    newObject.zydata.push(item.zyRate) 
                     
                })

                 response.data.average.forEach((item1,index)=>{
    
                    if(item1.type == 0){
                    newObject.qyavgdata.push(item1.average)
                    }else if (item1.type == 1){
                    newObject.zxavgdata.push(item1.average)
                    }else if(item1.type == 2){
                    newObject.zyavgdata.push(item1.average)
                    }
                       
                })
                }
                newObject.tdata.push("车身差错率");
                this.SystemCsRate = newObject;  
            });
        },
        //车电
        queryRateBarChartsBySystemCd(params){
            queryRateBySystemCd(params).then(response => {
        
               let newObject = {
                    tdata:[],
                    xdata:[],
                    qydata:[],
                    zxdata:[],
                    zydata:[],
                    qyavgdata:[],
                    zxavgdata:[],
                    zyavgdata:[]
                                          
                }  
                if(response.data.xInfo.length>0){
                response.data.xInfo.forEach((item,index)=>{
                   
                    newObject.xdata.push(item.month)
                    newObject.qydata.push(item.qyRate)
                    newObject.zxdata.push(item.zxRate)
                    newObject.zydata.push(item.zyRate) 
                     
                })

                 response.data.average.forEach((item1,index)=>{
    
                    if(item1.type == 0){
                    newObject.qyavgdata.push(item1.average)
                    }else if (item1.type == 1){
                    newObject.zxavgdata.push(item1.average)
                    }else if(item1.type == 2){
                    newObject.zyavgdata.push(item1.average)
                    }
                       
                })
                }
                newObject.tdata.push("车电差错率");
                this.SystemCdRate = newObject;  
            });
        },

    },

  
    
};
</script>
<style lang="scss">
.recordName .el-form-item__label{
    color:#fff;
    font-size: 12px;
} 
.problemStage .el-form-item__label{
    color:#fff;
    font-size: 12px;
}
.work{
    padding: 1em;
    background-color:#1d222a;
}
.header{
    margin-left: 15px;
}
.middle{
    display: flex;
    justify-content: space-between;
    
}
.middleTwo{
    background-image: url('./../../../assets/image/data1.png'); 
    background-size: 100% 100%;
    border-radius: 0%;
    margin-left:10px;
    margin-right:10px;
}

.footer{
    margin-top: 30px;
    display: flex;
    justify-content: space-between;
}
.GroupincomedistributionPie{
    width: 100%;
    height: 82%;
}

.w-line{
    width: 99%;
    height: 1px;
    border-top: solid #3c5e8f 1px;
    margin-left: 10px;
    margin-right: 10px;
}
.h-line{
    width: 1px;
    height: 99%;
    border-right: solid #3c5e8f 1px;
    margin-left: 10px;
    margin-right: 10px;
}
#workDetail .el-dialog__header{
    padding: 0px; 
    padding-bottom: 0px;
}
</style>